<!--
 * @Author: C.
 * @Date: 2023-01-30 16:42:06
-->
<template>
  <div class="screen-top-left2">
    <div class="screen-top-header flex-l">
      <div class="header-left flex-c">
        <i class="iconfont icon-layer-group"></i>
      </div>
      <div class="header-right flex-l">
        <span class="header-title">2</span>
        <dv-decoration-1 class="dv-dec-1" />
      </div>
    </div>
    <div class="screen-top-chart">
      <!-- <Chart :chart-data="chartData" /> -->
    </div>
  </div>
</template>

<script setup lang="ts">
  // import Chart from './chart/ChartTopLeft2.vue';
  // import { reactive } from 'vue';
</script>

<style lang="less" scoped>
  @import '../bigscreen.less';

  .screen-top-left2 {
    height: @box-height2;
    // width: @box-width2;
    background-color: @theme-sub-color;
    margin: 5px;
    border-radius: 10px;

    .screen-top-header {
      height: @chart-header-height;

      .header-left {
        width: 30px;
      }

      .header-right {
        width: calc(100% - 30px);

        .header-title {
          color: #fff;
          font-size: @sm-font-size;
        }

        .dv-dec-1 {
          width: 50px;
          height: 20px;
          margin-left: 10px;
        }
      }
    }
  }
</style>
